<template>
	<view class="findDoctor-wrap">
		<u-search class="search-input" placeholder="搜索医院/医生/疾病/知识" @click="gotoRouter('/pages/search/search?activeTab=1')"></u-search>

		<view class="findDoctor-office">
			<u-title value="全部科室"></u-title>
			<view class="findDoctor-office-box">
				<view class="findDoctor-office-main" v-for="(item, index) in ksList" :key="index" @click="gotoRouter('/pages/search/search?activeTab=1&tabShow=false&sicknessDepartmentId='+item.id)">
					<image :src="item.icon"></image>
					<view>{{item.departmentName}}</view> 
				</view>
			</view>
		</view>

		<view class="findDoctor-specialist" v-if="doctorList.length>0">
			<u-title value="专家推荐"></u-title>
			<view class="findDoctor-doctor-scroll ">
				<u-doctor-item v-for="(item, index) in doctorList" :key="index" :data="item"  @click="gotoRouter('/pages-hospital/doctorInfo/doctorInfo?id='+item.id)"></u-doctor-item>
			</view>
		</view>

		<!-- <view class="end-line">～我是有底线的呢～</view> -->
	</view>
</template>

<script>
import uSearch from '@/components/u-search/u-search.vue';
import uTitle from '@/components/u-title/u-title.vue';
import uDoctorItem from '@/components/u-doctor-item/u-doctor-item.vue';
export default {
	components: {
		uSearch,
		uDoctorItem,
		uTitle
	},
	data() {
		return {
			doctorList: [],
			ksList:[]
		};
	},
	onLoad(option) {},
	onShow() {
		this.queryDoctorList()
		this.queryKsList()
	},
	methods: {
		//医生列表
		queryDoctorList() {
			this.$api
				.queryDoctorList({
					params:{
						isExpert: 1,
						pageNo: 1,
						pageSize: 30
					}
				})
				.then(res => {
					if (res.code == 200) {
						this.doctorList = res.result.records
					} else {
						uni.showToast({
							title: res.message,
							icon: 'none'
						});
					}
				});
		},
		
		//科室列表
		queryKsList() {
			this.$api
				.queryKsList({

				})
				.then(res => {
					if (res.code == 200) {
						this.ksList = res.result
					} else {
						uni.showToast({
							title: res.message,
							icon: 'none'
						});
					}
				});
		},
	}
};
</script>

<style lang="less" scoped>
@import './findDoctor.less';
</style>
